<template>
  <div class="p-4" v-permission="permissionList.souYinTaiCase">
    <el-card class="w-48 h-28 flex flex-row items-center 
    select-none cursor-pointer hover:bg-slate-300"
    @click="willCaseSouYin"
    >
      <div class="flex flex-col items-start">
        <div class="w-10 h-10">
          <el-image src="http://file.vict5220.top/lCENahnRrk__2025_03_26__10_16_33.png?attname=%E7%8E%B0%E9%87%91.png"></el-image>
        </div>
        <span class="text-2xl font-bold">现金收款</span>
      </div>
    </el-card>
  </div>

  <InnerDialog v-model="caseSouYinDialog" :width="'500'" top="5vh">
    <template #header>
      现金收银
    </template>
    <template #default>
      <div>
        <div class="flex flex-row justify-start items-center m-4">
          <div class="w-36 required flex justify-start">输入收款金额:&nbsp;&nbsp;</div>
          <el-input clearable class="w-80"
          v-model="caseSouYinAO!.money" placeholder="请输入收款金额"></el-input>
        </div>
      </div>
    </template>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="caseSouYinCancel">取消</el-button>
        <el-button type="primary" @click="caseSouYinSave">保存</el-button>
      </div>
    </template>
  </InnerDialog>
</template>

<script setup lang="ts" name="SouYinTai">
import { permissionList } from '@/config/PermissionConfig';
import { useSouYinTaiHooks } from './SouYinTaiHooks';
import InnerDialog from '@/components/utils/InnerDialog.vue';

let {
  isCollapse, willCaseSouYin, caseSouYinDialog, caseSouYinAO,
  caseSouYinCancel, caseSouYinSave,
} = useSouYinTaiHooks();
</script>

<style scoped></style>
